$(function () {
  //**************************************加载列表轮播图
  let layer = layui.layer
  function getList() {
    let str = ''
    $.ajax({
      type: "GET",
      url: "admin/swipers",
      success: function (res) {
        if (status == 0) {
          console.log(res.data);
          for (let i = 0; i < res.data.length; i++) {
            str += `
          <tr>
              <td>${res.data[i].id}</td>
              <td>
                <img src="http://localhost:3000/uploads/${res.data[i].swiperimg}">
              </td>
              <td>${res.data[i].swiperlink}</td>
              <td>
                <!-- 在使用 -->
                <span class="layui-badge layui-bg-green" data-stutas='${res.data[i].swiperstatus}' data-id='${res.data[i].id}'>√</span>
              </td>
              <td>
                <button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete" data-id='${res.data[i].id}'>
              删除
            </button>
              </td>
            </tr>
          `
          }
          $('tbody').html(str)

          for (let i = 0; i < $('.layui-badge').length; i++) {
            if ($('.layui-badge').eq(i).attr('data-stutas') == 2) {
              $('.layui-badge').eq(i).removeClass("layui-bg-green").addClass('layui-bg-cyan').html('x')
            }
          }
        }

      }
    });
  }

  getList()





  // *************************************轮播图状态切换  使用还是未使用

  $('tbody').on('click', '.layui-badge', function () {
    let id = $(this).attr('data-id')
    let status = $(this).attr('data-stutas')
    if (status == 1) {
      $(this).attr('data-stutas', 2)
      $(this).removeClass("layui-bg-green").addClass('layui-bg-cyan').html('x')
      status = 2
    } else {
      $(this).attr('data-stutas', 1)
      $(this).removeClass("layui-bg-cyan").addClass('layui-bg-green').html('√')
      status = 1
    }


    $.ajax({
      type: "PUT",
      url: "admin/swipers/" + id,
      data: { status: status * 1 },
      success: function (res) {
        layer.msg(res.message);
      }
    });

  })






  // ***************************************删除操作
  $('tbody').on('click', '.delete', function (e) {
    var layer = layui.layer;
    let id = $(e.target).parent().siblings().eq('0').text();
    console.log(id);
    $.ajax({
      type: "DELETE",
      url: "admin/swipers/" + id,
      success: (response) => {
        console.log(response);
        layer.msg(response.message);
        if (response.status == 0) {
          $(this).parent().parent().remove();
        }
      }
    });
  })







  // ***************************************上传文件
  $('body').on('click', '#uploadSwiper', function () {
    $('#myfile').click()
  })

  // 监听文件选中事件
  $('body').on('change', '#myfile', function (e) {
    var layer = layui.layer;
    let files = e.target.files
    var fd = new FormData()
    $.each(files, function (index, item) {
      fd.append('swipers', item)
    })
    $.ajax({
      type: "POST",
      url: "admin/swipers",
      data: fd,
      processData: false,
      contentType: false,
      success: function (response) {
        layer.msg(response.message)
        if (response.status == 0) {
          // 重新渲染
          getList();
        }
      }
    });



  })
})